<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .a {
            background-color: #02BFFC;
            color: red;
            width: 400px;
            height: 50px;
        }

        .b {
            background-color: #FDFD04;
            width: 400px;
        }
    </style>
</head>

<body>
    <div class="a">
        <h1>今日家庭作业 -- 类选择器</h1>
    </div>
    <div class="b">
        <p>今天的家庭作业是，完成该效果，该段落使用<span style="background-color: #07F3F8;">十六进制颜色值</span> 进行修饰</p>
    </div>
    <div class="b">
        <p>Today's <span style="background-color: #7B0271;">homework</span> is To Complete The Effect</p>
    </div>
    <div class="b">
        <p>today's <span style="background-color: #14C1DF;">homework</span> is to complete the effect</p>
    </div>
    <div class="b">
        <p> <span style="color: green;">完成作业在屏幕中弹幕回复</span>，*** 同学作业已完成</p>
    </div>
    <div class="b">
        <p>HOMEWORK HAS BEEN FINISHED</p>
    </div>
</body>

</html>